<template>
    <div>
        <Form ref="formInline" :model="formInline" inline>
            <FormItem prop="输入部门名称">
                <Input type="text" v-model="formInline.department_name" placeholder="输入部门名称">
                </Input>
            </FormItem>
            <FormItem>
                <Button type="primary" @click="search()">搜索</Button>
            </FormItem>
        </Form>
        <Table border :columns="columns12" :data="data6">
            <template slot-scope="{ row }" slot="department_name">
                <strong>{{ row.department_name }}</strong>
            </template>
            <template slot-scope="{ row}" slot="action">
                <Button type="primary" size="small" style="margin-right: 5px" @click="show(row)">查看</Button>
            </template>
        </Table>
<!--        <Page :total="100" style="float: right;margin-top: 20px" @on-change="aa"/>-->
        <Page :total="params.totalRecord" show-sizer :page-size="params.pageSize" style="float: right;margin-top: 20px"
              show-total @on-change="aa" @on-page-size-change="pSizeChange"/>
    </div>
</template>

<script>
import { GetZlOrganizationList } from '@/api/user'
export default {
  data () {
    return {
      formInline: {
        department_name: ''
      },
      columns12: [
        {
          title: '序号列',
          type: 'index',
          align: 'center',
          width: 150
        },
        {
          title: '单位',
          slot: 'department_name',
          // fixed: 'left',
          align: 'center',
          width: 200
        },
        {
          title: '领导小组 ',
          key: 'framework',
          align: 'center',
          // fixed: 'left',
          width: 200
        },
        {
          title: '派驻纪检组（纪委）工作推进组',
          align: 'center',
          children: [
            {
              title: '组长',
              key: 'pzzz_name',
              align: 'center',
              width: 100
            },
            {
              title: '电话',
              key: 'pzzz_phone',
              align: 'center',
              width: 200
            },
            {
              title: '联络员',
              key: 'pzlly_name',
              align: 'center',
              width: 100
            },
            {
              title: '电话',
              key: 'pzllu_phone',
              align: 'center',
              width: 200
            }
          ]
        },
        {
          title: '技术保障组',
          align: 'center',
          children: [
            {
              title: '组长',
              key: 'jishu_name',
              align: 'center',
              width: 100
            },
            {
              title: '电话',
              key: 'jishu_phone',
              align: 'center',
              width: 200
            }
          ]
        },
        {
          title: '业务单位组',
          align: 'center',
          children: [
            {
              title: '分管领导',
              align: 'center',
              children: [
                {
                  title: '姓名 ',
                  key: 'fenguan_name',
                  align: 'center',
                  width: 100
                },
                {
                  title: '电话',
                  key: 'fenguan_phone',
                  align: 'center',
                  width: 200
                }
              ]
            },
            {
              title: '处长A',
              align: 'center',
              children: [
                {
                  title: '姓名',
                  key: 'chuzhanga_name',
                  align: 'center',
                  width: 100
                },
                {
                  title: '电话',
                  key: 'chuzhanga_phone',
                  align: 'center',
                  width: 200
                }
              ]
            },
            {
              title: '处长B',
              align: 'center',
              children: [
                {
                  title: '姓名',
                  key: 'chuzhangb_name',
                  align: 'center',
                  width: 100
                },
                {
                  title: '电话',
                  key: 'chuzhangb_phone',
                  align: 'center',
                  width: 200
                }
              ]
            },
            {
              title: '联络员',
              align: 'center',
              children: [
                {
                  title: '姓名',
                  key: 'ywlian_name',
                  align: 'center',
                  width: 100
                },
                {
                  title: '电话',
                  key: 'ywlian_phone',
                  align: 'center',
                  width: 200
                }
              ]
            }
          ]
        },
        {
          title: '最后更新时间',
          key: 'update_time',
          width: 170,
          fixed: 'right'
        },
        {
          title: '操作',
          slot: 'action',
          align: 'center',
          fixed: 'right',
          width: 80
        }
      ],
      data6: [],
      params: { pageNo: 1, pageSize: 10, totalRecord: 0 }
    }
  },

  props: {

  },

  components: {

  },

  computed: {

  },

  methods: {
    async show (row) {
      // let aa
      // await getZlOrganizationByID({ id: row.id }).then(ret => {
      //   aa = ret.data.data
      // })
      // console.log(aa, 'aaaaaaaa1111')
      this.$router.push({
        path: 'organizationf',
        query: { a: row }
      })
    },
    aa (current) {
      GetZlOrganizationList({ pageNo: current }).then(ret => {
        this.data6 = ret.data.data.results
        this.data6.forEach(item, index => {
          item.update_time = this.$common.xeUtils.toDateString(item.update_time)
          console.log(item.update_time, index)
        })
      })
    },
    pSizeChange (val) {
      GetZlOrganizationList({ pageSize: val }).then(ret => {
        let data = ret.data.data.results
        this.data6 = data
      })
    },
    search () {
      GetZlOrganizationList({ department_name: this.formInline.department_name }).then(ret => {
        this.data6 = ret.data.data.results
        this.params.totalRecord = ret.data.data.totalRecord
      })
    }
  },
  watch: {

  },

  mounted () {
    GetZlOrganizationList().then(ret => {
      this.data6 = ret.data.data.results
      this.params.totalRecord = ret.data.data.totalRecord
      console.log(this.data6)
      this.data6.forEach(item => {
        item.update_time = this.$common.xeUtils.toDateString(item.update_time)
        console.log(item)
      })
      // let data = []
      // ret.data.data.results.forEach(item => {
      //   data.push({
      //     id: item.id,
      //     paizhu: item.discipline_team + ' ' + item.discipline_liaison,
      //     yewu: item.operational_anagership + ' ' + item.business_directora + ' ' + item.business_directorb + ' ' + item.business_liaison,
      //     framework: item.framework,
      //     update_time: this.$common.xeUtils.toDateString(item.update_time),
      //     technical_team: item.technical_team,
      //     department_name: item.department_name
      //   })
      // })
      // this.data6 = data
      // this.params.totalRecord = ret.data.data.totalRecord
    })
  }

}
</script>

<style scoped>

</style>
